<template>
	<div>
		<a-typography>
			<a-typography-title>Params: {{ route.params || {} }}</a-typography-title>
			<a-typography-title>Query: {{ route.query || {} }}</a-typography-title>
			<a-space :size="24">
				Link:
				<nuxt-link target="_blank" class="app-link" href="https://nuxt.com/docs/getting-started/routing"> 点击直达 </nuxt-link>
				<a-button :loading="loading" @click="getRegion">获取接口数据</a-button>
			</a-space>
		</a-typography>
		<a-spin :loading="loading">
			<pre><code>{{ dataSource }}</code></pre>
		</a-spin>
	</div>
</template>

<script setup lang="ts">
const route = useRoute();

const { data: dataSource, loading, request: getRegion } = useRequest(getRegionsApi);
</script>

<style scoped></style>
